{include file="public/header"}

<body>
    <div class="layui-fluid">
        <div class="layui-row">
            <form action="" method="post" class="layui-form layui-form-pane">
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">标题</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <input type="text" id="title" name="title" value="{$row.title|default=''}" required=""
                                lay-verify="required" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form">
                    <div class="layui-card-header">类型</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <input type="radio" name="leixin" lay-filter="type" value="1" {if empty($row.leixin) ||
                                $row.leixin==1}checked{/if} title="公告">
                            <input type="radio" name="leixin" lay-filter="type" value="2" {if !empty($row.leixin) &&
                                $row.leixin==2}checked{/if} title="学习内容">
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form fltype" {if !empty($row.leixin) &&
                    $row.leixin==2}style="display:block" {else/}style="display:none" {/if}>
                    <div class="layui-card-header">细分类型</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <input type="radio" name="fltype" lay-filter="fltype" value="1" {if !empty($row.fltype) ||
                                $row.fltype==1}checked{/if} title="规章制度">
                            <input type="radio" name="fltype" lay-filter="fltype" value="2" {if !empty($row.fltype) &&
                                $row.fltype==2}checked{/if} title="业务知识">
                            <input type="radio" name="fltype" lay-filter="fltype" value="3" {if !empty($row.fltype) &&
                                $row.fltype==3}checked{/if} title="资料架">
                            <input type="radio" name="fltype" lay-filter="fltype" value="4" {if !empty($row.fltype) &&
                                $row.fltype==4}checked{/if} title="视频学习">
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">显示发布日期</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <input type="text" id="dates" name="dates" value="{$row.dates}" required=""
                                lay-verify="required" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">截止日期(超过截止日期内容将不显示(截止日期当日会显示)，通知栏目请尽量填写一个遥远的日期)</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <input type="text" id="enddates" name="enddates" value="{$row.enddates}" required=""
                                lay-verify="required" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">可查看人群</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <input type="checkbox" name="like1[write]" lay-skin="primary" lay-filter="father"
                                title="全选">
                        </div>
                        <div class="layui-col-md12">
                            {foreach $typelist as $k => $v}
                            <input name="type[]" lay-skin="primary" type="checkbox" value="{$k}" title="{$v}" {if
                                !empty($row.type) && in_array($k, $row.type)} checked {/if}>
                            {/foreach}
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form">
                    <label class="layui-form-label">
                        <font color="red">* </font>可见督导类型(当前类型仅对督导有效)
                    </label>
                    <div class="layui-input-block">
                        <input type="radio" name="sonstype" lay-filter="sonstype" value="0" {if
                            empty($row.sonstype)}checked{/if} title="全部可见">
                        <input type="radio" name="sonstype" lay-filter="sonstype" value="1" {if !empty($row.sonstype) ||
                            $row.sonstype==1}checked{/if} title="督导督导可见">
                        <input type="radio" name="sonstype" lay-filter="sonstype" value="2" {if !empty($row.sonstype) &&
                            $row.sonstype==2}checked{/if} title="督导专员可见">
                    </div>
                </div>
                <!-- <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">资料附件(暂未开放,此栏目请跳过)</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <a class="layui-btn layui-btn-btn layui-btn-sm layui-btn-normal" lay-submit=""
                                lay-filter="addtable2">添加附件</a>
                            <table class="layui-table layui-form" style="border:1px solid #ccc;" id="table2"
                                lay-filter="table2">
                                <thead>
                                    <tr>
                                        <td>
                                            <div class="layui-table-cell">序号</div>
                                        </td>
                                        <td>
                                            <div class="layui-table-cell">附件名称</div>
                                        </td>
                                        <td>
                                            <div class="layui-table-cell">附件链接</div>
                                        </td>
                                        <td>
                                            <div class="layui-table-cell">操作</div>
                                        </td>
                                    </tr>
                                </thead>
                                <tbody>

                                </tbody>
                            </table>
                        </div>
                    </div>
                </div> -->
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">图文内容</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <textarea id="content" name="content">
                                {if !empty($row.content)}{:htmlspecialchars_decode($row.content)}{/if}</textarea>
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form">
                    <div class="layui-card-header">是否通知</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <input type="radio" name="message"  value="1" title="通知相关人员">
                            <input type="radio" name="message"  value="2" checked title="不通知">
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <input type="hidden" value="{$row['id']|default='0'}" name="id" />
                    {if !empty($row.id)}<button class="layui-btn layui-bg-cyan" lay-submit=""
                        lay-filter="add2">提交并重置通知</button>{/if}
                    <button class="layui-btn" lay-submit="" lay-filter="add">提交保存</button>
                </div>
            </form>
        </div>
    </div>
    {include file="public/footer"}
    <script src="../../layuiadmin/tinymce/tinymce.min.js"></script>
    <script>
        $("body").on("click", ".del", function () {
            $(this).closest("tr").remove();
        });
        layui.use(['form', 'layer', 'upload', "layedit", 'laydate'], function () {
            $ = layui.jquery;
            var form = layui.form
                , upload = layui.upload
                , element = layui.element
                , layer = layui.layer
                , laydate = layui.laydate
            layedit = layui.layedit;
            laydate.render({
                elem: '#dates'
                , type: 'date'
            });
            form.on('checkbox(father)', function (data) {
                if (data.elem.checked) {
                    $(data.elem).parent().next('div').find('input').prop("checked", true);
                    form.render();
                } else {
                    $(data.elem).parent().next('div').find('input').prop("checked", false);
                    form.render();
                }
            });
            form.on('submit(addtable2)', function (data) {
                var i = $('#table2 tbody tr').length;
                //你要添加的html
                var html = '<tr>';
                html += '<td>' + (i + 1) + '</td>';
                html += '<td><input placeholder="例：督导学习资料下载" required="" lay-verify="required" type="text" class="layui-input" name="fujian[' + i + '][name]"' + ' /></td>';
                html += '<td style="display:flex"><input style="width: 80%;" readonly placeholder="点击右侧上传按钮上传文件" required="" lay-verify="required" type="text" class="layui-input" name="fujian[' + i + '][url]"' + ' /><button type="button" class="layui-btn test">上传</button></td>';
                html += '<td><a class="layui-btn layui-btn-danger del">删除</a></td>';
                html += '</tr>';
                $(html).appendTo($('#table2 tbody:last'));
                form.render();
            });
            //图片上传
            var uploadInst = upload.render({
                elem: '.test'
                , url: '/base/upload_img'
                , accept: 'file'
                , before: function (obj) { //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
                    layer.load(); //上传loading
                }
                , done: function (res) {
                    console.log(res);
                }
                , error: function () {
                    console.log(error);
                    //演示失败状态，并实现重传
                    return layer.msg('文件上传失败，请重试');
                    layer.closeAll('loading'); //关闭loading
                }
            });
            laydate.render({
                elem: '#enddates'
                , type: 'date'
            });
            //获得base64
            function getBase64(blob, callback) {
                var a = new FileReader();
                a.onload = function (e) { callback(e.target.result); };
                a.readAsDataURL(blob);
            };
            tinymce.init({
                selector: '#content',
                paste_data_images: true,
                automatic_uploads: true,
                paste_enable_default_filters: true,//过滤
                // toolbar: 'importword',
                images_upload_url: '/Base/upload_img', // 服务器端接收图片的URL
                language: 'zh_CN',//注意大小写
                plugins: 'importword paste preview searchreplace autolink directionality visualblocks visualchars fullscreen image link media code codesample table charmap pagebreak nonbreaking anchor insertdatetime advlist lists wordcount emoticons autosave autoresize',
                min_height: 500, //编辑器高度
                paste_preprocess: function (plugin, args) {
                    // 遍历剪贴板中的所有图片
                    console.log(plugin, args);
                },
                setup: function (edit) {
                    edit.on('paste', function (e) {
                        console.log(e.clipboardData);
                        var text = e.clipboardData.getData('text');
                        // if (text == '') {
                        var items = e.clipboardData.items;
                        $.each(items, function (i, item) {
                            console.log(item);
                            if (item.kind == 'file' && item.type.indexOf('image/') !== -1) {
                                var blob = item.getAsFile();
                                var xhr, formData;
                                formData = new FormData();
                                getBase64(blob, function (base64) {
                                    edit.insertContent('<img src="' + base64 + '"/>');
                                });
                                e.preventDefault();
                            };
                        });
                        // }
                    });
                },
                images_upload_handler: function (blobInfo, success, failure, progress) {
                    var xhr, formData;
                    var file = blobInfo.blob();//转化为易于理解的file对象
                    xhr = new XMLHttpRequest();
                    xhr.withCredentials = false;
                    xhr.open('POST', '/Base/upload_img');
                    xhr.onload = function () {
                        var json;
                        if (xhr.status != 200) {
                            layer.msg(xhr.status);
                            return;
                        }
                        json = JSON.parse(xhr.responseText);
                        if (json.status != 0) {
                            layer.msg(json.data.msg);
                            return;
                        }
                        success(json.data.src);
                    };
                    formData = new FormData();
                    formData.append('file', file, file.name);
                    xhr.send(formData);
                },
                file_picker_callback: function (callback, value, meta) {
                    //文件分类
                    var filetype = '.pdf, .txt, .zip, .rar, .7z, .doc, .docx, .xls, .xlsx, .ppt, .pptx, .mp3, .mp4';
                    //后端接收上传文件的地址
                    var upurl = '/Base/upload_img';
                    //为不同插件指定文件类型及后端地址
                    switch (meta.filetype) {
                        case 'image':
                            filetype = '.jpg, .jpeg, .png, .gif';
                            upurl = '/Base/upload_img';
                            break;
                        case 'media':
                            filetype = '.mp3, .mp4';
                            upurl = '/Base/upload_img';
                            break;
                        case 'file':
                        default:
                    }
                    //模拟出一个input用于添加本地文件
                    var input = document.createElement('input');
                    input.setAttribute('type', 'file');
                    input.setAttribute('accept', filetype);
                    input.click();
                    input.onchange = function () {
                        var file = this.files[0];
                        var xhr, formData;
                        xhr = new XMLHttpRequest();
                        xhr.withCredentials = false;
                        xhr.open('POST', upurl);
                        xhr.onload = function () {
                            var json;
                            if (xhr.status != 200) {
                                layer.msg(xhr.status);
                                return;
                            }
                            json = JSON.parse(xhr.responseText);
                            console.log(json);
                            if (json.status != 0) {
                                layer.msg(json.data.msg);
                                return;
                            }
                            callback(json.data.src);
                        };
                        formData = new FormData();
                        formData.append('file', file, file.name);
                        xhr.send(formData);
                    };
                    form.render();
                },
            });
            form.on('radio(type)', function (data) {
                if (data.value == 2) {
                    $('.fltype').show();
                } else {
                    $('.fltype').hide();
                }
            });
            //监听提交
            form.on('submit(add2)', function (data) {
                data.field.isread = 2;
                data.field.content = tinymce.activeEditor.getContent();
                //发异步，把数据提交给php
                $.ajax({
                    type: 'post',
                    data: data.field,
                    success: function (res) {
                        if (res.status == 0) {
                            layer.msg(res.msg, { icon: 6, time: 1000 }, function () {
                                // 获得frame索引
                                var index = parent.layer.getFrameIndex(window.name);
                                parent.location.reload();
                                parent.layer.close(index);
                            });
                        } else {
                            layer.msg(res.msg, { icon: 2, time: 1000 });
                        }
                    }
                });
                return false;
            });
            //监听提交
            form.on('submit(add)', function (data) {
                data.field.content = tinymce.activeEditor.getContent();
                //发异步，把数据提交给php
                $.ajax({
                    type: 'post',
                    data: data.field,
                    success: function (res) {
                        if (res.status == 0) {
                            layer.msg(res.msg, { icon: 6, time: 1000 }, function () {
                                // 获得frame索引
                                var index = parent.layer.getFrameIndex(window.name);
                                parent.location.reload();
                                parent.layer.close(index);
                            });
                        } else {
                            layer.msg(res.msg, { icon: 2, time: 1000 });
                        }
                    }
                });
                return false;
            });
        });
    </script>